const pages = [
    {
        name: 'nginx',
        url: '/assets/html/nginx.html',
        resource: []
    },
]


export async function processRenderPage() {
    for (let i = 0; i < pages.length; i++) {
        const text = await fetchPage(pages[i].url);
        renderPage('app', pages[i], text)
    }
}


export async function fetchPage(url) {
    const text = await fetch(url, {
        body: null, method: 'Get', headers: {},
    }).then(response => {
        if (!response.ok) {
            throw new Error(`HTTP error! status: ${response.status}`);
        } else {
            return response.text();
        }
    })
    return text
}


export function renderPage(parentNodeID = 'app', pageInstance, html_text) {
    const new_dom = document.createElement('div');
    new_dom.innerHTML = html_text;
    new_dom.className= 'page-render-container'
    //new_dom.id = 'page_render_container-' + pageInstance.name
    //////////////////////////////////////////
    const parent_dom = window.document.getElementById(parentNodeID);
    parent_dom.insertAdjacentElement('afterbegin', new_dom);
    //////////////////////////////////////////
    if (pageInstance.resource.length > 0) {
        for (let item of pageInstance.resource) {
            if (item.endsWith('.css')) {
                const link = document.createElement('link');
                link.rel = 'stylesheet';
                link.href = item;
                document.head.appendChild(link);
            }
            else if (item.endsWith('.js')) {
                const script = document.createElement('script');
                script.src = item;
                document.head.appendChild(script);
            } else {
                console.log("resource doesn't support");
                continue;
            }

        }
    }

}